<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- ## 1.实现全选，不选，反选
`num.checked = true选中   num.checked = false不选` -->
    <button id="btn1">全选</button>
    <button id="btn2">不选</button>
    <button id="btn3">反选</button><br>
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <input type="checkbox">
    <script>
        var btn = document.getElementsByTagName('button');
        var check = document.getElementsByTagName('input');
        
            for (var i = 0; i < btn.length; i++) {
                btn[i].onclick = function () {
                    if (this.innerHTML === "全选") {
                        for (var j = 0; j < check.length; j++) {
                            check[j].checked = true;
                        }
                    }else if(this.innerHTML ==="不选"){
                        for (var j=0;j<check.length;j++){
                            check[j].checked = false;
                        }
                    }else if(this.innerHTML==="反选"){
                        for (var j = 0; j < check.length; j++){
                            check[j].checked = !check[j].checked
                        }
                    }
                }
            }
        
    </script>
</body>

</html>